<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="keywords" content="" />
<meta http-equiv="description" content="" />
<title>Ecommerce Website</title>
<link href="style.css" type="text/css" rel="stylesheet" />

<!--[if IE 6]>
<script type="text/javascript" src="DD_belatedPNG_0.0.8a.js"></script>
<script type="text/javascript" language="javascript">
DD_belatedPNG.fix('*');
</script>
<![endif]-->

</head>


<body>
<!--顶部top-->
<div class="top">
	<div class="topcon">
    	<ul class="topleft">
        	<li class="nobg"><a href="##">Account Sign In</a></li>
            <li><a href="##">Register</a></li>
            <li><a href="##">Buyers Guide</a></li>
            <li><a href="##">About</a></li>
            <li><a href="##">Blog</a></li>
            <li><a href="##">Contact</a></li>
        </ul>
        <ul class="topright">
        	<li class="call">123.456.7890</li>
            <li class="help"><a href="##">Live Help</a></li>
            <li><a class="Canada" href="##"></a></li>
            <li><a class="England" href="##"></a></li>
        </ul>
    </div>
</div>
<!--头部header-->
<div class="header">
	<div class="head">
    	<div class="bag">
        	<p>0 items in your bag</p>
            <a href="##">Check Out</a>
        </div>
        <h1><a href="##">Ecommerce Website</a></h1>
        <form class="search" action="##" method="post">
        	<input class="text" type="text" placeholder="Search website"/>
            <input class="go" type="submit" value="" />	
        </form>
    </div>
</div>
<!--导航nav-->
<div class="nav">
	<ul>
    	<li><a href="##"><span><strong>home</strong></span></a></li>	
        <li><a href="##"><span><strong>latest arrivals</strong></span></a></li>
        <li><a href="##"><span><strong>Men's</strong></span></a></li>
        <li><a href="##"><span><strong>Women's</strong></span></a></li>	
        <li><a href="##"><span><strong>kids</strong></span></a></li>
        <li><a href="##"><span><strong>Brands</strong></span></a></li>
        <li><a href="##"><span><strong>Sale</strong></span></a></li>	
        <li><a href="##"><span><strong>Gift Cards</strong></span></a></li>
        <li><a href="##"><span><strong>Freebies</strong></span></a></li>
    </ul>
</div>
<!--内容区content-->
<div class="main">
<div class="content ">
	<div class="conbottombg">
    	<div class="contopbg clear">
        	<!--广告区banner-->
            <div class="banner">
            	<a href="##"><img src="images/banner/ad.jpg" alt="" /></a>
                <div class="mask"></div>
                <h3>product title</h3>
                <p><a href="##">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras suscipit lacus dapibus ante mattis in adipiscing nibh placerat. Cras bibendum porta diam, non dignissim sapien malesuada vitae. </a></p> 
            </div> 
            <!--左侧内容区-->
            <div class="conleft">
                <div class="sidebar"><!--侧边栏-->
                	<div class="sidtopbg">
                    	<div class="sidbottombg">
                            <h3>Browse Categories</h3>
                            <ul>
                                <li><a href="##">Lorem ipsum dolor sit </a></li>
                                <li><a href="##">Amet consectetur</a></li>
                                <li><a href="##">Adipiscin elit</a></li>
                                <li><a href="##">Cras suscipit lacus</a></li>
                                <li><a href="##">Dapibus ante mattis</a></li>
                                <li><a href="##">Adipiscing nibh placerat</a></li>
                                <li><a href="##">Cras bibendum</a></li>
                                <li><a href="##">Porta diam elit</a></li>
                                <li><a href="##">Adipiscing nibh placerat</a></li>
                                <li><a href="##">Cras bibendum</a></li>
                                <li><a href="##">Porta diam elit</a></li>
                            </ul>
                		</div>
                    </div>            
                </div>
                <div class="join"><!--加入我们-->
                	<div class="jointopbg">
                    	<div class="joinbottombg">
                            <p>Join our newsletter list to get the latest updates</p>
                            <form action="##" method="post">
                                <input class="text" type="text" />
                                <input class="joinnow" type="submit" value="Join Now" />	
                            </form>
                            <ul>
                                <li class="twitter"><a href="##">Follow us on Twitter</a></li>
                                <li class="fan"><a href="##">Become our fan on Facebook</a></li>
                                <li class="in"><a href="##">Connect with us on LinkedIn</a></li>
                                <li class="send"><a href="##">Send us your email enquiries</a></li>
                            </ul>
                		</div>
                    </div>            
                </div>
                <div class="pay"><!--支付方式-->
                	<img src="images/pay.jpg" alt="" />
                </div>
            </div>
            <!--右侧内容区-->
            <div class="conright">
                <div class="contop clear "><!--内容顶部-->
                    <dl>
                    	<dt>Sort by:</dt>
                        <dd><span>Ascending</span><a href="##"></a></dd>
                        <dd><span>Product Name</span><a href="##"></a></dd>
                        <dd><span>Brand Name</span><a href="##"></a></dd>
                    </dl>
                    <p>Items per page: <a href="##">12</a> / <a href="##">20</a> / <a href="##">30</a> / <a href="##">50</a></p>
                </div>
                <div class="product clear"><!--产品-->
                	<h3>Our Products</h3>
                    <ul>
                    	<li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                        <li>
                        	<a href="##"><img src="images/product/pro2.jpg" alt="" /></a>
                            <p><a href="##">Product Name</a></p>
                            <span>Price:<em> $12.99</em></span>
                        </li>
                    </ul>
                    <div class="page">
                        <a href="##">1</a>
                        <a href="##">2</a>
                        <a href="##">3</a>
                        <a href="##">4</a>
                        <a href="##">5</a>
                        <a href="##">Next ></a>
                        <a href="##">Last >></a>
                    </div>
                   
                </div>
                <div class="featpro"><!--精选产品-->
                	<h3>featured products</h3>
                    <div class="featured">
                		<div class="featleft">
                        	<div class="featright">
                            	<div class="featlist">
                                    <ul>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg" alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg"alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg"alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg"alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg"alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                        <li>
                                            <a href="##"><img src="images/product/fea2.jpg"alt="" /></a>
                                            <p><a href="##">Download shopping bag & icons (PSD & PNG)</a></p>
                                        </li>
                                    </ul>
                            	</div> 
                                <div class="featbtn">
                                    <a id="btnleft" href="##"></a>
                                    <a id="btnright" href="##"></a>
   								</div>       
                         	</div>       
                         </div>   
                	</div>            
                </div>
            </div>
		</div>
    </div>            
</div>
</div>
<!--售后服务区-->
<div class="service">
	<div class="sercon">
        <p class="safe">Shop online with us safely & securely</p>
        <p class="ship">We ship your orders anywhere!</p>
        <form class="search" action="##" method="post">
        	<input class="text" type="text" placeholder="Search website"/>
            <input class="go" type="submit" value="" />	
        </form>
    </div>
</div>
<!--尾部-->
<div class="footer">
	<div class="foot">
         <dl>
            <dt><a href="##">Company</a></dt>
            <dd><a href="##">Home</a></dd>
            <dd><a href="##">About Us</a></dd>
            <dd><a href="##">Blog</a></dd>
            <dd><a href="##">Latest News</a></dd>
            <dd><a href="##">Login</a></dd>
            <dd><a href="##">Join Us</a></dd>
         </dl>
         <dl>
            <dt><a href="##">Categories</a></dt>
            <dd><a href="##">Lorem ipsum dolor sit</a></dd>
            <dd><a href="##">Amet consectetur</a></dd>
            <dd><a href="##">Adipiscin elit </a></dd>
            <dd><a href="##">Cras suscipit lacus</a></dd>
            <dd><a href="##">Dapibus ante mattis</a></dd>
            <dd><a href="##">Adipiscing nibh placerat</a></dd>
         </dl>
         <dl>
            <dt><a href="##">Information</a></dt>
            <dd><a href="##">My Account</a></dd>
            <dd><a href="##">Rewards</a></dd>
            <dd><a href="##">Terms & Conditions</a></dd>
            <dd><a href="##">Buying Guide</a></dd>
            <dd><a href="##">FAQ</a></dd>
         </dl>
         <dl>
            <dt><a href="##">Social Network</a></dt>
            <dd><a href="##">My Account</a></dd>
            <dd><a href="##">Rewards</a></dd>
            <dd><a href="##">Terms & Conditions</a></dd>
            <dd><a href="##">Buying Guide</a></dd>
            <dd><a href="##">FAQ</a></dd>
         </dl>
         <dl class="contact">
            <dt>Contact Us</dt>
            <dd>Phone: 1.234.567.8901</dd>
            <dd>Toll-Free: 1.234.567.8901</dd>
            <dd>Fax: 1.234.567.8901</dd>
            <dd>Email:<a href="##">Send us an email</a></dd>
            <dd class="rest">
                <p>MON - SAT 9am to 7:30pm</p>
                <p>Sundays, holidays closed</p>
            </dd>
         </dl>
	</div>
</div>
</body>
</html>
